<template>
  <view>
    <view class="blue-header"/>
    <view class="container">
      <Card v-for="(item, index) in noteContext" :title="item.title" :key="index" :sub-text="item"
            @onClick="onClick(item, index)"></Card>
    </view>
  </view>
</template>

<script>
import uniSegmentedControl
  from '@/components/uni-segmented-control/components/uni-segmented-control/uni-segmented-control.vue';
import Card from '@/pages/tab2/components/card.vue';
import {getCurrentWeekRange, getCurrentMonthRange} from '@/api/report/utils/utils';

export default {
  data() {
    return {
      noteContext: [
        {
          title: '日报',
          workNote: '今日工作总结',
          planNote: '明日工作计划',
          otherNote: '其他事项',
          other: '我的附件'
        },
        {
          title: '周报',
          workNote: '本周工作总结',
          planNote: '下周工作计划',
          otherNote: '其他事项',
          other: '我的附件'
        },
        {
          title: '月报',
          workNote: '本月工作总结',
          planNote: '下月工作计划',
          otherNote: '其他事项',
          other: '我的附件'
        },
        {
          title: '我的报告',
          workNote: '查看我的报告',
          planNote: '',
          otherNote: ''
        },
        {
          title: '我收到的',
          workNote: '我收到的报告',
          planNote: '',
          otherNote: ''
        }
      ],
      currentTab: -1,
      cuurentDay: '今天09:00 至 今天18:30',
      cuurentWeek: getCurrentWeekRange(),
      cuurentMonth: getCurrentMonthRange()
    };
  },
  methods: {
    onClick(e, key) {
      switch (key) {
        case 0:
          uni.navigateTo({
            url: `/pages/tab2/report/report?id=${key}`
          });
          break;
        case 1:
          uni.navigateTo({
            url: `/pages/tab2/report/report?id=${key}`
          });
          break;
        case 2:
          uni.navigateTo({
            url: `/pages/tab2/report/report?id=${key}`
          });
          break;
        case 3:
          uni.navigateTo({
            url: '/pages/tab2/record/index'
          });
          break;
        case 4:
          uni.navigateTo({
            url: '/pages/tab2/record/index?type=1'
          });
          break;
        default:
          console.log('未匹配到有效的 key 值，不进行跳转');
      }
    }
  },
  components: {
    Card
  }
};
</script>

<style>
/* 顶部蓝色头部样式 */
.blue-header {
  background-color: #3c96f3;
  height: 300rpx;
  width: 100vw;
  color: #fff;
  text-align: center;
  font-size: 50rpx;
  z-index: 0; /* 降低层级 */
}

/* 卡片容器样式 */
.container {
  display: flex;
  justify-content: start;
  padding: 20rpx;
  flex-wrap: wrap;
  width: calc(100vw - 20rpx);
  position: absolute; /* 设置为绝对定位 */
  top: 150rpx; /* 顶部对齐 */
  left: -8rpx; /* 左侧对齐 */
  z-index: 1; /* 提高层级 */
}
</style>
